// 1像素边框
.border {
  position: relative;

  &::before {
    content: '';

    display: block;
    width  : 100%;
    height : 100%;

    position: absolute;
    left    : 0;
    top     : 0;
    z-index : 10;

    box-sizing      : border-box;
    padding         : 1px;
    border          : 1px solid;
    transform-origin: 0 0;
    pointer-events  : none;
  }

  @media screen and (-webkit-min-device-pixel-ratio: 2) {
    &::before {
      width    : 200%;
      height   : 200%;
      transform: scale(0.5);
    }
  }

  @media screen and (-webkit-min-device-pixel-ratio: 3) {
    &::before {
      width    : 300%;
      height   : 300%;
      transform: scale(0.3333);
    }
  }

  &.hide-border-top::before {
    border-top: none;
  }

  &.hide-border-right::before {
    border-right: none;
  }

  &.hide-border-bottom::before {
    border-bottom: none;
  }

  &.hide-border-left::before {
    border-left: none;
  }
}